<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" http-equiv="Content-Type"  charset="gb2312" content="width=device-width, initial-scale=1.0, user-scalable=no"/>
  </head>
	<link rel="stylesheet" href="css/jquery.mobile-1.4.5.css">
	<link rel="stylesheet" href="css/w3.css">
	<link rel="stylesheet" href="css/w3-theme-red.css">
	<link rel="stylesheet" href="css/font-awesome.min.css">	
	<script src="js/jquery.min.js"></script>
	<script src="js/jquery-ui.min.js"></script>
	<script src="js/jquery.ui.touch-punch.js"></script>
	<script src="js/jquery.mobile-1.4.5.js"></script>
	<script src="car.js"></script>
	<style>
	.loading {
		background:   url(images/loading.gif) center center no-repeat;
		background-size: 30px 30px;
	}
	img {
	    position: absolute;
	}

	img#c_front {
	    top: 0%; left: 37%;
	    nav-index: 1;
	    nav-right: #b2; nav-left: #b4;
	    nav-down: #b2; nav-up: #b4;
	}

	img#c_right {
	    top: 37%; left: 74%;
	    nav-index: 2;
	    nav-right: #b3; nav-left: #b1;
	    nav-down: #b3; nav-up: #b1;
	}

	img#c_back {
	    top: 74%; left: 37%;
	    nav-index: 3;
	    nav-right: #b4; nav-left: #b2;
	    nav-down: #b4; nav-up: #b2;
	}

	img#c_left {
	    top: 37%; left: 0%;
	    nav-index: 4;
	    nav-right: #b1; nav-left: #b3;
	    nav-down: #b1; nav-up: #b3;
	}
	img#c_center {
	    top: 37%; left: 37%;
	    nav-index: 3;
	    nav-right: #b4; nav-left: #b2;
	    nav-down: #b4; nav-up: #b2;
	}

	</style>	
  <body onload="initialize()"  style="-moz-user-select:none;-webkit-user-select:none;">
	<div data-role="page" id="pageBob" data-theme="a">
	<header class="w3-opennav w3-container w3-card-4 w3-theme">
  		<h3>&nbsp			
			<i id="bt_status_gif1"   style="position:absolute; left:5%; top:3%;  font-weight:100">&nbsp &nbsp &nbsp &nbsp </i>		
			<div id="bt_status_gif"  onclick="BT_search()" style="background:url(images/search.png) left center no-repeat;background-size: 30px 30px; position:absolute; left: 0%; top:3%;  font-weight:100">&nbsp &nbsp search</div>
  		</h3>
	</header>
	</header>

	<div id="draggable"  style=" position: absolute; right:20%;width:150px;height:150px; ">
		<img  data-role="none" style="transform:rotate(-90deg);" src="images/arrow.png"  id="c_front" onclick="ima_car('l2','L11')"> </img>
		<img  data-role="none"   src="images/arrow.png" id="c_right" onclick="ima_car('l11','L11')" >  </img>
		<img  data-role="none" style="transform:rotate(-270deg);" src="images/arrow.png"  id="c_back" onclick="ima_car('l11','L4')"> </img>
		<img  data-role="none"  style="transform:rotate(-180deg);" src="images/arrow.png"  id="c_left" onclick="ima_car('l2','L4')" > </img>			 
	</div>
	<input type="button" value="stop"  onClick = "ima_car('l7','L7')"  data-role="none">
	
	<div id="BT_list"> 	</div>
	<footer style="position:absolute;bottom:0%;width:100%"class="w3-container w3-theme w3-margin-top">
		<h3>&nbsp
		</h3>
	</footer>
</div>
  </body>
</html>
